﻿<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<html>
<head><link rel="stylesheet" href="${ctx}/common/common.css">
    <title>Title</title>
    <link rel="stylesheet" href="${ctx}/common/plugins/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="${ctx}/common/plugins/layuiadmin/style/admin.css" media="all">
    <script src="${ctx}/common/plugins/layuiadmin/layui/layui.js"></script>
    
</head>
<body>
<form class="layui-form" action="${ctx}/area/saveArea" style="margin-top: 50px">
    <input type="hidden" name="id" id="aId" value="${area.id}" />
    <input type="hidden" name="delete_flag" value="0" />
    <div class="layui-form-item layui-col-md5">
        <label class="layui-form-label">区域名称<span style="color: red">*</span></label>
        <div class="layui-input-block">
            <input type="text" name="name" required value="${area.name}"  lay-verify="required" placeholder="请输入区域名称" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item layui-col-md5">
        <label class="layui-form-label">区域编码<span style="color: red">*</span></label>
        <div class="layui-input-block">
            <input type="text" name="code" required value="${area.code}"  lay-verify="required" placeholder="请输入区域编码" autocomplete="off" class="layui-input" onKeyUp="value=value.replace(/[^\d|chun]/g,'')">
        </div>
    </div>
<%--     <div class="layui-form-item layui-col-md5">
        <label class="layui-form-label">上级区域</label>
            <div class="layui-input-block">
                <div class="a1" style="display: block;width: 100%;padding-left: 0px;height: 38px;background: #eee;">
                    <input type="text" name="pname" required value="${parentArea.name}" placeholder="请选择上级区域" lay-verify="required"   readonly autocomplete="off" class="layui-input">
                    <input type="hidden" name="pid" required value="${area.t_a_id}"   readonly autocomplete="off" class="layui-input">
                </div>
                <div class="a2" style="width: 98%;position: absolute;background: white;z-index: 10;border: 1px solid #e7e7e7;border-top: none;display: none;">
                    <ul id="areaTree"></ul>
                </div>
            </div>

            <input type="text" name="name" required value="${managementSystem.name}"  lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
    </div> --%>
     <div class="layui-form-item layui-col-md5">
        <label class="layui-form-label">上级区域</label>
        <div class="layui-input-block">
            <input type="hidden" name="pid" id="pid"  value="${area.t_a_id}" class="layui-input">
            <input readonly id="area" lay-type="showPerson" value="${parentArea.name}"  placeholder="请选择上级区域"   autocomplete="off" class="layui-input">
            <button type="button" id="clearPerson" class="layui-btn layui-btn-primary">清空父类</button>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn"  id="formBtn" lay-submit lay-filter="formDemo">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            <button type="button" id="rollback" class="layui-btn layui-btn-primary">返回</button>
        </div>
    </div>
</form>

<script>
    layui.use(['form','laydate','tree','layer'], function() {
        //初始化
        var $ = layui.$, layer = layui.layer;
        var form = layui.form;
        $('.a1').on("click",function(){
            $('.a2').fadeIn()
        });
/*         var url = '${ctx}/area/findAreaPage';
        $.ajax({
            type:"post",	//数据传输方式
            url : url,		//请求路径
            dataType:"json",	//预期服务器返回的数据类型 text,json
            //scriptCharset: 'utf-8',
            success:function(msg){
                console.log(msg);
                layui.tree({
                    elem:'#areaTree',
                    nodes: msg,
                    click: function(node){
                        $("input[name=pname]").val(node.name);
                        $("input[name=pid]").val(node.id);
                        $('.a2').hide();
                    }
                });
            },//服务器响应函数
            error:function(){alert("网络接连不可用,无法连接服务器或服务器返回数据类型不一致");}
        }); */
    })
    layui.use('form', function(){
        var form = layui.form;

        //监听提交
        form.on('submit(formDemo)', function(data){
            layer.load(1, {
                shade: [0.1,'#fff'] //0.1透明度的白色背景
            });
            //  $("#formBtn").attr("disabled",true);
        });
    });
    
    document.getElementById("area").addEventListener("click", function () {
        layer.open({
           type: 2,
           skin: 'layui-layer-rim', //加上边框
           area: ['30%', '80%'], //宽高
           content: '${ctx}/area/areaTree'
       });
       form.render();
   })
    document.getElementById("clearPerson").addEventListener("click", function () {
    	document.getElementById("pid").value="";
    	document.getElementById("area").value="";
    })
    document.getElementById("rollback").addEventListener("click",function(){
        window.history.back();
    })
</script>
</body>
</html>



